/*布局样式*/
.grid_2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}
.grid_3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}
.grid_4 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}
.grid_5 {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
}
.grid_6 {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
}

.flex_sub {
  flex: 1;
}
.flex_wrap {
  flex-wrap: wrap;
}
.flex_start {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.flex_start_clm {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-direction: column;
}
.flex_center {
  display: flex;
  align-items: center;
  justify-content: center;
}
.flex_center_clm {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.flex_around {
  display: flex;
  align-items: center;
  justify-content: space-around;
}
.flex_around_clm {
  display: flex;
  align-items: center;
  justify-content: space-around;
  flex-direction: column;
}
.flex_between {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.flex_between_clm {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-direction: column;
}
.position_relative {
  position: relative;
}
.top50 {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
.left50 {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
.topleft50 {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

/*清除浮动*/
.clearfix:after {
  content: '.';
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.clearfix {
  display: inline-block;
}

.h20px {
  height: 20px;
}
.h100 {
  height: 100%;
}
.w100 {
  width: 100%;
}

/* 圆角 */
.radius_4 {
  border-radius: 4px;
  overflow: hidden;
}
.radius_6 {
  border-radius: 6px;
  overflow: hidden;
}
.radius_8 {
  border-radius: 8px;
  overflow: hidden;
}
.radius_10 {
  border-radius: 10px;
  overflow: hidden;
}
.radius_half {
  border-radius: 50%;
  overflow: hidden;
}
.radius_round {
  border-radius: 9999px;
  overflow: hidden;
}

/* 阴影 */
.shadow_gray {
  box-shadow: 0 2px 10px 0 rgb(48 48 48 / 6%);
}
.shadow_box {
  box-shadow: 0 2px 12px 0 rgb(0 0 0 / 10%);
}
.shadow_ccc {
  box-shadow: 0 0 8px #ccc;
}

/* 两行省略 */
.cut_two {
  text-align: justify;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  word-break: break-all;
}
.cut_one {
  text-align: justify;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
  word-break: break-all;
}
.text_cut {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

/* 边距 */
.flex_gap_xs {
  gap: 5px;
}
.flex_gap_sm {
  gap: 10px;
}
.flex_gap {
  gap: 15px;
}
.flex_gap_xl {
  gap: 20px;
}
.margin_top_xs {
  margin-top: 5px;
}
.margin_top_sm {
  margin-top: 10px;
}
.margin_top {
  margin-top: 15px;
}
.margin_top_xl {
  margin-top: 20px;
}
.margin_bottom_xs {
  margin-bottom: 5px;
}
.margin_bottom_sm {
  margin-bottom: 10px;
}
.margin_bottom {
  margin-bottom: 15px;
}
.margin_bottom_xl {
  margin-bottom: 20px;
}
.margin_left_xs {
  margin-left: 5px;
}
.margin_left_sm {
  margin-left: 10px;
}
.margin_left {
  margin-left: 15px;
}
.margin_left_xl {
  margin-left: 20px;
}
.margin_right_xs {
  margin-right: 5px;
}
.margin_right_sm {
  margin-right: 10px;
}
.margin_right {
  margin-right: 15px;
}
.margin_right_xl {
  margin-right: 20px;
}
.margin_lr_xs {
  margin-left: 5px;
  margin-right: 5px;
}
.margin_lr_sm {
  margin-left: 10px;
  margin-right: 10px;
}
.margin_lr {
  margin-left: 15px;
  margin-right: 15px;
}
.margin_lr_xl {
  margin-left: 20px;
  margin-right: 20px;
}
.margin_tb_xs {
  margin-top: 5px;
  margin-bottom: 5px;
}
.margin_tb_sm {
  margin-top: 10px;
  margin-bottom: 10px;
}
.margin_tb {
  margin-top: 15px;
  margin-bottom: 15px;
}
.margin_tb_xl {
  margin-top: 20px;
  margin-bottom: 20px;
}
.m_2 {
  margin: 2px;
}
.padding_top_xs {
  padding-top: 5px;
}
.padding_top_sm {
  padding-top: 10px;
}
.padding_top {
  padding-top: 15px;
}
.padding_top_xl {
  padding-top: 20px;
}
.padding_bottom_xs {
  padding-bottom: 5px;
}
.padding_bottom_sm {
  padding-bottom: 10px;
}
.padding_bottom {
  padding-bottom: 15px;
}
.padding_bottom_xl {
  padding-bottom: 20px;
}
.padding_left_xs {
  padding-left: 5px;
}
.padding_left_sm {
  padding-left: 10px;
}
.padding_left {
  padding-left: 15px;
}
.padding_left_xl {
  padding-left: 20px;
}
.padding_right_xs {
  padding-right: 5px;
}
.padding_right_sm {
  padding-right: 10px;
}
.padding_right {
  padding-right: 15px;
}
.padding_right_xl {
  padding-right: 20px;
}
.padding_lr_xs {
  padding-left: 5px;
  padding-right: 5px;
}
.padding_lr_sm {
  padding-left: 10px;
  padding-right: 10px;
}
.padding_lr {
  padding-left: 15px;
  padding-right: 15px;
}
.padding_lr_xl {
  padding-left: 20px;
  padding-right: 20px;
}
.padding_tb_xs {
  padding-top: 5px;
  padding-bottom: 5px;
}
.padding_tb_sm {
  padding-top: 10px;
  padding-bottom: 10px;
}
.padding_tb {
  padding-top: 15px;
  padding-bottom: 15px;
}
.padding_tb_xl {
  padding-top: 20px;
  padding-bottom: 20px;
}
/* // 文字对齐 */
.text_center {
  text-align: center;
}
.text_left {
  text-align: left;
}
.text_right {
  text-align: right;
}
.text_justify {
  text-align: justify;
}

/* // 字体 */
.text_bold {
  font-weight: bold !important;
}
.text_10 {
  font-size: 12px !important;
  display: inline-block;
  transform: scale(0.833333333);
}
.text_10_l {
  font-size: 12px !important;
  display: inline-block;
  transform: scale(0.833333333);
  transform-origin: top left;
}
.text_11_l {
  font-size: 12px !important;
  display: inline-block;
  transform: scale(0.91666666);
  transform-origin: top left;
  -webkit-transform: scale(0.91666666);
  -moz-transform: scale(0.91666666);
  -ms-transform: scale(0.91666666);
  -o-transform: scale(0.91666666);
}
.text_10_r {
  font-size: 12px !important;
  display: inline-block;
  transform: scale(0.833333333);
  transform-origin: top right;
}
.text_12 {
  font-size: 12px !important;
}
.text_13 {
  font-size: 13px !important;
}
.text_14 {
  font-size: 14px !important;
}
.text_16 {
  font-size: 16px !important;
}
.text_18 {
  font-size: 18px !important;
}
.text_20 {
  font-size: 20px !important;
}
.text_22 {
  font-size: 22px !important;
}
.text_24 {
  font-size: 24px !important;
}
.text_26 {
  font-size: 26px !important;
}
.text_30 {
  font-size: 30px !important;
}
.text_36 {
  font-size: 36px !important;
}
.text_100 {
  font-size: 100px !important;
}

/* 点击效果 */
.clickactive {
  position: relative;
  cursor: pointer;
}
.clickactive::before {
  content: '';
  display: inline-block;
  height: 100%;
  width: 100%;
  left: 0;
  top: 0;
  z-index: 9999;
  position: absolute;
  background: transparent;
  pointer-events: none;
  transition: all 0.3s;
}
.clickactive:active::before {
  background: rgba(170, 170, 170, 0.4);
}
/* 点击效果 */

/* // 背景颜色 */
.bg_fff {
  background: #fff !important;
}
.bg_blue {
  background: #1b64f2 !important;
}
.bg_f9fbfd {
  background: #f9fbfd;
}

/* // 文字颜色 */
.text_white {
  color: #fff !important;
}
.text_deep_white {
  color: #ededed;
}
.text_333 {
  color: #333;
}
.text_gray {
  color: #8d96a5;
}
.text_deep_gray {
  color: #404e68;
}
.text_light_black {
  color: #181d28;
}
.text_red {
  color: #f56c6c;
}
.text_blue {
  color: #409eff;
}
.text_deep_blue {
  color: #556ff6;
}
.text_green {
  color: #12b057;
}

.blue_btn {
  height: 28px;
  line-height: 28px;
  background: #1b64f2;
  color: #fff;
  user-select: none;
}
.blue_plain_btn {
  height: 28px;
  line-height: 28px;
  background: #fff;
  color: #1b64f2;
  border: 1px solid #1b64f2;
  user-select: none;
}

.cursor_pointer {
  cursor: pointer;
}
.select_none {
  user-select: none;
}
.ellipsis {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
}

/* // 卡片列表 */
.bg_e9f5ea {
  background: #e9f5ea;
}
.bg_ebf1ff {
  background: #ebf1ff;
}
.bg_fef9e4 {
  background: #fef9e4;
}
.text_1d8ea2 {
  color: #1d8ea2;
}
.text_3b7cff {
  color: #3b7cff;
}
.text_cc7c00 {
  color: #cc7c00;
}
.text_938ea4 {
  color: #938ea4;
}
.text_ff2626 {
  color: #ff2626;
}
.card_item_shadow {
  box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.02);
}
.err_border {
  border: 2px solid #ff2626;
  box-shadow: 0px 2px 10px 0px rgba(255, 38, 38, 0.1);
}
.execution {
  &-title {
    display: flex;
    justify-content: space-between;
    font-weight: 600;
    margin-bottom: 5px;
    .clear {
      color: red;
      cursor: pointer;
    }
  }
  .el-tag {
    height: 26px;
    line-height: 26px;
  }
  &-wrap {
    max-height: 300px;
    overflow: auto;
    overflow-x: hidden;
  }
}